import axios from 'axios'

// 导入仓库
import store from '@/store'

// 导入 router
import router from '@/router'
import { Toast } from 'vant'

const instance = axios.create({
  baseURL: 'http://toutiao.itheima.net',
  timeout: 10000
})

// 添加请求拦截器  => 记得将axios 换成instance
instance.interceptors.request.use(
  function(config) {
    // 在发送请求之前做些什么 ==> 在请求头的headers中带伤token信息
    const token = store.state.user.token.token

    // token存在的时候, 才带过去
    if (token) {
      config.headers.Authorization = `Bearer ${token}`

      // console.log('请求拦截器的config配置对象: ', config)
    }
    return config
  },
  function(error) {
    // 对请求错误信息做些什么
    return Promise.reject(error)
  }
)

// 添加响应拦截器
instance.interceptors.response.use(
  function(response) {
    // 对响应数据做些什么
    // console.log('响应拦截器的response ', response)
    // return response
    // 在组件中发送请求得到的结果皆可以少写一层data
    return response.data
  },
  async function(error) {
    // 对响应错误做点什么
    // console.log('error', error)

    // 判断响应的状态码 status 401 (token过期了) ==> 跳转login页面重新登录
    if (error.response.status === 401) {
      // 1. 清除过期的token
      // store.commit('mutations方法')
      // store.dispatch('actions方法')

      // store.commit('user/removeToken')

      // 2. 跳转
      // router.push({
      //   path: '/login',
      //   query: {
      //     // 带上回去的路
      //     back: router.currentRoute.fullPath
      //   }
      // })
      // 无感刷新
      // 使用refreshToken 请求新的token值
      const refreshToken = store.state.user.token.refresh_token

      if (refreshToken) {
        console.log(refreshToken)

        try {
          // 发送请求获取新的token数据
          // 注意: 这次请求使用axios来发送请求,不能使用instance发送请求,因为请求拦截器中会默认添加headers(里面是 过期的token数据),所以使用axios发送数据,新的headers里面要携带刷新token
          const res = await axios({
            method: 'PUT',
            // axios没有配置过根路径,所以url要带上完整的地址
            url: 'http://toutiao.itheima.net/v1_0/authorizations',
            // 需要在请求头中携带Authorization, 带上刷新token
            headers: {
              Authorization: 'Bearer ' + refreshToken
            }
          })
          // 获取到的新的token值
          console.log(res.data.data.token)
          // 存储到vuex仓库,更新vuex仓库过期的token数据
          store.commit('user/setToken', {
            token: res.data.data.token,
            refresh_token: refreshToken
          })

          // 重新请求, 获取页面数据
          // 根路径的配置 + 请求拦截器(带上新的token)
          // error.config 是之前请求的相关配置信息
          return instance(error.config)
        } catch (e) {
          // 请求失败 重新登录
          goLogin()
        }
      } else {
        // // refresh 失效时, 清空token数据
        // store.commit('user/removeToken')
        // // 跳转登录页面重新登录
        // router.push({
        //   path: '/login',
        //   query: {
        //     // 带上回去的路
        //     back: router.currentRoute.fullPath
        //   }
        // })
        goLogin()
      }
    } else {
      // 非401的情况 ==> 不是token过期问题
      return Promise.reject(error)
    }
  }
)

// 封装跳转去登录的代码
function goLogin() {
  // 清空token数据
  store.commit('user/removeToken')
  // 跳转去登录页面
  this.$router.push({
    path: '/login',
    back: router.currentRoute.fullPath
  })

  // 提示token过期,重新登录
  Toast.fail('登录过期,请重新登陆')
}

// 导出axios的实例
export default instance
